<template>
	<div>
		<el-form :inline="true" :model="formInline" class="demo-form-inline">
			<el-form-item label="输入药品编码:" prop="name">
				<el-input v-model="formInline.idnumber" placeholder="请输入药品编码"></el-input>
			</el-form-item>
			<el-form-item>
				<el-button type="primary" @click="getdrug()">查询</el-button>
			</el-form-item>
			<el-form-item>
				<el-button type="primary" @click="getalldrug()">显示全部药品</el-button>
			</el-form-item>
			<el-form-item>
				<el-button type="primary" @click="dialogFormVisible = true">添加药品</el-button>
			</el-form-item>
		</el-form>
		<el-divider></el-divider>
		<el-table :data="drug" style="width: 100%">
			<el-table-column prop="code" label="药品编码" width="180">
			</el-table-column>
			<el-table-column prop="name" label="药品名称" width="180">
			</el-table-column>
			<el-table-column prop="format" label="药品规格" width="180">
			</el-table-column>
			<el-table-column prop="manufacturer" label="生产厂家" width="180">
			</el-table-column>
			<el-table-column prop="money" label="价格" width="180">
			</el-table-column>
			<el-table-column label="操作" width="180">
				<template slot-scope="scope">
					<el-button type="primary" @click="deleteRow(scope.$index,drug)">删除</el-button>
				</template>
			</el-table-column>
		</el-table>
		<el-dialog title="添加药品" :visible.sync="dialogFormVisible">
			<el-form ref="ruleForm" :model="ruleForm" :rules="rules" label-width="80px" class="demo-ruleForm">
				<el-row class="arow">
					<el-col class="add" :span="12" :offset="2">
						<el-form-item label="药品编码" prop="code" required="">
							<el-input v-model="ruleForm.code" style="width: 400px;"></el-input>
						</el-form-item>
					</el-col>
				</el-row>
				<el-row class="arow">
					<el-col class="add" :span="12" :offset="2">
						<el-form-item label="药品名称" prop="name" required="">
							<el-input v-model="ruleForm.name" style="width: 400px;"></el-input>
						</el-form-item>
					</el-col>
				</el-row>
				<el-row class="arow">
					<el-col class="add" :span="12" :offset="2">
						<el-form-item label="药品规格" prop="format" required="">
							<el-input v-model="ruleForm.format" style="width: 400px;"></el-input>
						</el-form-item>
					</el-col>
				</el-row>
				<el-row class="arow">
					<el-col class="add" :span="12" :offset="2">
						<el-form-item label="生产厂家" prop="manufacturer" required="">
							<el-input v-model="ruleForm.manufacturer" style="width: 400px;"></el-input>
						</el-form-item>
					</el-col>
				</el-row>
				<el-row class="arow">
					<el-col class="add" :span="12" :offset="2">
						<el-form-item label="价格" prop="money" required="">
							<el-input v-model="ruleForm.money" style="width: 400px;"></el-input>
						</el-form-item>
					</el-col>
				</el-row>
			</el-form>
			<div slot="footer" class="dialog-footer">
				<el-button type="primary" @click="submitForm('ruleForm')">添加</el-button>
				<el-button type="primary" @click="dialogFormVisible = false">关闭</el-button>
			</div>
		</el-dialog>
	</div>
</template>

<script>
	import {
		showMsgTitle
	} from '@/utils/api'
	import {
		showMsgConfirm
	} from '@/utils/api'
	import {
		getRequest
	} from '@/utils/api'
	import {
		postRequest
	} from '@/utils/api'
	import {
		uploadFileRequest
	} from '@/utils/api'
	import {
		putRequest
	} from '@/utils/api'
	import {
		deleteRequest
	} from '@/utils/api'
	import {
		showConstants
	} from '@/utils/api'
	import {
		mapMutations
	} from "vuex";
	export default {
		data() {
			return {
				ruleForm: {
					code: '',
					name: '',
					format: '',
					manufacturer: '',
					money: ''
				},
				rules: {
					code: [{
						required: true,
						message: '请输入药品编码',
						trigger: 'blur'
					}],
					name: [{
						required: true,
						message: '请输入药品名称',
						trigger: 'blur'
					}],
					format: [{
						required: true,
						message: '请输入药品规格',
						trigger: 'blur'
					}],
					manufacturer: [{
						required: true,
						message: '请输入生产厂家',
						trigger: 'blur'
					}],
					money: [{
						required: true,
						message: '请输入药品价格',
						trigger: 'blur'
					}]

				},
				formInline: {
					idnumber: '',
				},
				drug: [],
				dialogTableVisible: false,
				dialogFormVisible: false,
				form: {
					name: '',
					region: '',
					date1: '',
					date2: '',
					delivery: false,
					type: [],
					resource: '',
					desc: ''
				},
				formLabelWidth: '120px'
			}
		},
		methods: {
			deleteRow(index, rows) {
				console.log(this.drug[index].code);
				postRequest('/deldrug?code=' + this.drug[index].code);
				rows.splice(index, 1);
			},
			getalldrug() {
				this.$axios.get('http://localhost:8081/alldrug').then((result) => {
					console.log(result.data);
					this.drug = result.data
				}).catch((err) => {
					console.log(error);
				});
			},
			getdrug() {
				//postRequest('/idregister?idnumber='+this.formInline.idnumber);
				this.$axios.get('http://localhost:8081/codedrug?code=' + this.formInline.idnumber).then((result) => {
					console.log(result.data);
					this.drug = result.data
				}).catch((err) => {
					console.log(error);
				});
			},
			submitForm(formName) {
				postRequest('/adddrug', this.ruleForm).then(resp => {
				alert("药品添加成功！");
				}).catch((err) => {
					alert("药品添加失败，请重新添加！");
				});
			},
		}
	}
</script>

<style>

</style>
